import React, { useEffect, useState, useCallback } from 'react'
import { useLocation, useHistory } from 'react-router-dom'
import { FinancialFromType } from '../../../../assets/enum'
import BusinessTravel from './components/BusinessTravel'
import Commission from './components/Commission'
import Entertain from './components/Entertain'
import Popularize from './components/Popularize'
import WordOffice from './components/WordOffice'
import Transportation from './components/Transportation'
import AfterSales from './components/AfterSales'
import Tender from './components/Tender'
import Serve from './components/Serve'
import Car from './components/Car'
import WaterElectricOil from './components/WaterElectricOil'
import ElseCost from './components/ElseCost'

import { getAccOverallBasic } from '../../financialApi'
import { FinancialApplyFormAll, FinancialApplyFormForm } from './style'
import { message, PageHeader } from 'antd'

const MoneyApplyForm = () => {
    const location = new useLocation()
    const { serialNo, financialApplyType } = location.state
    const history = useHistory()
    const [formData, setFormData] = useState({})
    const formFun = useCallback(
        (serialNo) => {
            ; (async () => {
                const { code, msg, data } = await getAccOverallBasic({ serialNo })
                if (code === '20000') {
                    setFormData(data)
                } else {
                    message.error(msg);
                }
            })()
        },
        [],
    )
    useEffect(() => {
        if (serialNo) {
            formFun(serialNo)
        }
    }, [serialNo, formFun])
    const formVisibleFun = () => {
        switch (financialApplyType) {
            case 6: //出差
                return <BusinessTravel formData={formData} />
            case 2: //佣金
                return <Commission formData={formData} />
            case 9: //招待
                return <Entertain formData={formData} />
            case 0: //推广
                return <Popularize formData={formData} />
            case 11: //办公
                return <WordOffice formData={formData} />
            case 3: //运输
                return <Transportation formData={formData} />
            case 8: //售后
                return <AfterSales formData={formData} />
            case 1: //标书
                return <Tender formData={formData} />
            case 10: //服务
                return <Serve formData={formData} />
            case 7: //汽车
                return <Car formData={formData} />
            case 4: //水电油
                return <WaterElectricOil formData={formData} />
            case 5: //其他
                return <ElseCost formData={formData} />
            default:
                break;
        }
    }
    return <FinancialApplyFormAll>
        <PageHeader
            className="site-page-header"
            title={FinancialFromType[financialApplyType]}
            onBack={() => history.go('-1')}
        />
        <FinancialApplyFormForm>
            {formVisibleFun()}
        </FinancialApplyFormForm>
    </FinancialApplyFormAll>
}

export default MoneyApplyForm